import { constantRoutes, asyncRoutes } from '@/router'

const state = {
  routes: constantRoutes // 所有人默认拥有静态路由
  // routes: [...constantRoutes, ...asyncRoutes]
}
const mutations = {
  // 更新路由
  updateRotes(state, newRotes) {
    // newRoutes可以认为是 用户登录 通过权限所得到的动态路由的部分
    // 错误写法--- state.routes = [...state.routes, ...newRoutes]
    // 有一种情况  张三 登录 获取了动态路由 追加到路由上  李四登录 4个动态路由
    // 应该是每次更新 都应该在静态路由的基础上进行追加
    state.routes = [...constantRoutes, ...newRotes]
  }
}
const actions = {
  // menus参数这里可以理解为获取用户信息后得到的权限标识(由此规定可以显示的路由)
  filterRotes(context, menus) {
    const routes = []
    menus.forEach(key => {
      // 筛选出路由别名与权限标识相同的动态路由后  得到的数组展开添加到新数组中
      const res = asyncRoutes.filter(item => item.name === key)
      routes.push(...res)
    })
    context.commit('updateRotes', routes) // 新路由数组更新state,以显示界面左侧边栏
    return routes // 这里返回的新动态路由是给路由addRoutes用的
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
